import React, { useMemo, useState } from 'react';
import { isEqual } from 'lodash';

import { defaultTabStore, TabStoreContext } from '@/pages/SalaryManage/constant/TabStoreContext';

const TabStoreProvider = ({ children }) => {
    const [store, setStore] = useState(defaultTabStore.store);

    const context = useMemo(
        () => ({
            store,
            setStore,
            mergeTabStore: tabInfo => {
                const newStore = { ...store, ...tabInfo };

                if (!isEqual(newStore, store)) {
                    setStore(newStore);
                }
            },
            clearTabStore: () => {
                setStore({});
            }
        }),
        [store]
    );

    return <TabStoreContext.Provider value={context}>{children}</TabStoreContext.Provider>;
};

export default TabStoreProvider;
